前言

(真的有人會看嗎?)

大家好，個人第一次參加鐵人賽，
雖然說參加鐵人賽，但其實只是藉這個活動，紀錄自己JavaScript(簡稱JS)的學習筆記。

以下為簡單的注意事項:

-每天文章當天寫，沒有特別準備大綱
-因為學習紀錄為主，可能會發生不到30天就把想寫的都寫完的情況
-基於以上兩點，標題的30天入門JavaScript是騙人的(對不起)
-本學習筆記以前端用的JS為主，HTML跟CSS部分不會提
-參考資料:各種書跟線上課程，有幸完賽的話會在最後一天提到
-使用的文字編輯器為Visual Studio Code,瀏覽器為最新版chrome
-個人也是學習中，如果內容有錯誤可以留言，非常感謝<(_ _)>

明天會從變數跟基本資料類型正式開始，但為了怕真的有新新新手看到這篇，
下面有簡單的文字編輯器安裝跟基本操作教學。

VSCode 安裝跟基本操作

google搜尋Visual Studio Code 進入官網下載

安裝完後開啟VSCode，工具列選擇:檔案>開啟資料夾>選一個資料夾來放檔案

首先網頁需要HTML檔案，
在左邊檔案總管右鍵>新增檔案 新增一個html檔(副檔名.html)

新增好後打一個驚嘆號，點VSCode給的選項(如下圖)或按下tab鍵 (詳細請google:Emmet)

會自動補完基本的模板HTML，加入以下程式碼

  <script>
    console.log('Hello world');
  </script>

<script>標籤:可以在標籤內撰寫JS程式碼
console.log()函式:將括號內的內容在控制台顯示，開發時用來測試輸出

-如果不知道甚麼是標籤，可以去MDN看說明
-函式在之後的學習筆記會說明

加完後會長成這樣

此時對檔案總管的HTML檔右鍵>Open in Default Browser 打開chrome

打開網頁後會發現一片空白，
是因為console.log()這個函式是用來測試除錯用的，只會顯示在除錯用的控制台(console)

按F12打開開發者工具，在控制台就能看到印出的Hello world

引用外部的JS程式碼

當JS程式碼量大時，在HTML內寫JS程式會顯得很亂。

同剛剛新增HTML檔案的方式，在檔案總管新增JS檔案(副檔名.js)
改變HTML內的<script>標籤內容

  //將
  
 <script>
    console.log('Hello world');
  </script>
  
  //改變為
  
  <script src="你取的JS檔名.js"></script>

這樣就可以連到外部的JS檔了
接著在JS檔案中寫入剛才的程式碼，打開控制台會看到同樣輸出的結果。

往後如果沒特別提，HTML就是以下的樣子，只修改JS檔內容來學習

使用註解

在程式碼中加入說明，可以用來說明程式碼內容，
分為單行註解跟多行註解，詳細直接看以下範例

//這是單行註解 用兩個斜線 到本行結束前的內容都會被忽略不會被執行
//就算在單行註解後加入程式碼也不會被執行 像這樣:   console.log('你好');
console.log('你好'); //在程式碼後加上單行註解 斜線前的程式碼還是會被執行

/* 
這是多行註解   
由/*開頭    
 * /(中間不要有空格)結尾
 ? (就是下面這個) 中間的內容都不會被執行 即使換行也一樣
*/
  

之後的筆記都會使用consolo.log()來測試輸出，
因為一直截控制台的圖很麻煩(當然比較複雜的輸出還是會截一下)，簡單的內容會用註解來表示輸出結果

//之後的console.log輸出都會在後面用單行註解加上結果喔~
//就像下面這樣子

console.log('你好');    //你好
console.log(123);      //123